
<template>
  <h1>不使用pinia</h1>
  <button @click="add">+1</button>{{ num }}
  <hr />
  <button @click="sub">-1</button>{{ num2 }}
</template>

<script lang="ts" setup>
import { reactive, ref } from "vue";

let num = ref(0);
let num2 = ref(100);

function add() {
  num.value++;
}

function sub() {
  num2.value--;
}
</script>

<style scoped>
.br {
  font-size: 18px;
  border-bottom: 1px solid beige;
  margin: 10px 20px;
}
.brr {
  font-size: 24px;
  border-bottom: 1px solid red;
}
</style>